<template>
  <div class="home-container">
    <div class="home-content">
      <div class="home-title">尊敬的客户您好，请输入您的手机号</div>
      <Input :send="send"></Input>
    </div>
  </div>
</template>

<script setup lang="ts">
import { ref, reactive, onMounted } from 'vue'
import { useRouter } from 'vue-router'
import Input from '@/components/Input/index.vue'

const router = useRouter()

const send = () => {
  router.push('/menu/chat')
}
</script>

<style scoped lang="less">
.home-container {
  display: flex; /* 启用Flex布局 */
  flex-direction: column;
  align-items: center; /* 水平居中 */
  justify-content: center; /* 垂直居中 */
  background-color: #fff;
  height: 100vh;
  width: 100%; /* 确保容器占满整个宽度 */

  .home-content {
    display: flex; /* 启用Flex布局 */
    flex-direction: column;
    justify-content: center; /* 垂直居中 */
    align-items: center; /* 水平居中 */
    width: 100%; /* 让内容容器占满宽度 */
    margin-top: -200px;

    .home-title {
      font-size: 24px;
      margin-bottom: 30px; /* 给标题和输入框之间增加间距 */
    }
  }
}
</style>
